import type { ArtColumn } from 'ali-react-table';
import { Button, Divider, Select } from 'antd';

type ColumnsOptionsType = {
  login: (row: any) => void;
  logout: (row: any) => void;
  edit: (row: any) => void;
  del: (row: any) => void;
  onChangeMarket: (dataId: number, index: number) => void;
  hasDel: boolean;
  hasEdit: boolean;
};

const loginStatus = [
  { name: '未登录', color: '#FD4F43' },
  { name: '已登录', color: '#30D485' },
];
const crawlerStatus = [
  { name: '未爬取', color: '#D9D9D9' },
  { name: '爬取中', color: '#18A0FB' },
  { name: '爬取成功', color: '#30D485' },
  { name: '爬取失败', color: '#FD4F43' },
];

const getColumns = ({
  login,
  logout,
  edit,
  del,
  onChangeMarket,
  hasDel,
  hasEdit,
}: ColumnsOptionsType): ArtColumn[] => {
  return [
    {
      name: '序号',
      width: 80,
      align: 'center',
      code: 'index',
    },
    {
      name: '交易单元',
      code: 'stationName',
      align: 'center',
    },
    {
      name: '场站名称',
      code: 'schedulingName',
      align: 'center',
    },
    {
      name: '交易中心',
      code: 'marketName',
      align: 'center',
      render: (value, row, index) => {
        const marketList = row.marketList.filter((item: any) => item.value);
        return (
          <Select
            value={row.dataId}
            style={{ width: '100%' }}
            onChange={(val) => onChangeMarket(val, index)}
            options={marketList}
            disabled={marketList.length === 0}
          />
        );
      },
    },
    {
      name: '登录账号',
      code: 'userName',
      width: 180,
      align: 'center',
    },
    {
      name: '登录状态',
      code: 'loginStatus',
      width: 180,
      align: 'center',
      render: (value, row) => {
        if (value) {
          const item = loginStatus[Number(value)];
          return (
            <div className="status">
              <div className="round" style={{ background: item.color }} />
              {item.name}
            </div>
          );
        }
        return '-';
      },
    },
    {
      name: '当前登录人',
      code: 'loginUser',
      width: 180,
      align: 'center',
      render: (value, row) => {
        return value ? value : '-';
      },
    },
    // {
    //   name: '爬取状态',
    //   code: 'crawlerStatus',
    //   width: 180,
    //   align: 'center',
    //   render: (value, row) => {
    //     if (value) {
    //       const item = crawlerStatus[Number(value)];
    //       return (
    //         <div className="status">
    //           <div className="round" style={{ background: item.color }} />
    //           {item.name}
    //         </div>
    //       );
    //     }
    //     return '-';
    //   },
    // },
    {
      name: '登录操作',
      code: 'loginOpt',
      align: 'center',
      width: 200,
      render: (value, row) => {
        return (
          <>
            <Button
              type="primary"
              onClick={() => login(row)}
              style={{ marginRight: 20 }}
              size="small"
              disabled={!row.dataId || row.loginStatus === '1'}
            >
              登入
            </Button>
            <Button
              type="primary"
              size="small"
              onClick={() => logout(row)}
              disabled={!row.dataId || row.loginStatus === '0'}
            >
              登出
            </Button>
          </>
        );
      },
    },
    {
      name: '操作',
      code: 'options',
      align: 'center',
      width: 100,
      render: (value, row) => {
        return (
          <div className="btns">
            {/* <Button
              type="link"
              onClick={() => edit(row)}
              disabled={row.loginStatus === '1' || hasEdit}
            >
              编辑
            </Button> */}
            {/* <Divider type="vertical" /> */}
            <Button
              type="link"
              onClick={() => del(row)}
              disabled={row.loginStatus === '1' || hasDel}
            >
              删除
            </Button>
          </div>
        );
      },
    },
  ];
};

export { getColumns };
